<template>
  <div class="bg">
    <!-- 头部 -->
    <Header title="系统管理—登陆日志"></Header>

    <!-- 搜索 -->
    <section class="search_bar">
      <LDateTimeSelect2 label="查询日期" style="margin-left: 16px"></LDateTimeSelect2>
      <LButton label="搜索" style="margin-left: 16px"></LButton>
    </section>
    <!-- 内容 -->
    <el-table :data="tableData" border style="width: 100%; margin-top: 3vh">
      <el-table-column prop="datetime" label="时间"> </el-table-column>
      <el-table-column prop="building" label="楼宇"> </el-table-column>
      <el-table-column prop="ID" label="登陆ID"> </el-table-column>
      <el-table-column prop="loginAccount" label="登陆名"> </el-table-column>
      <el-table-column label="操作">
        <template #default></template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4" :page-sizes="[10, 20, 30, 40]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400" class="logo-logPage">
    </el-pagination>
  </div>
</template>

<script>
import Header from "@/components/Header";
import moment from "moment";
import LDateTimeSelect2 from "../../../components/LDateTimeSelect2.vue";
import LButton from "../../../components/LButton.vue";

export default {
  components: {
    Header,
    LDateTimeSelect2,
    LButton,
  },
  data() {
    return {
      tableData: [
        {
          datetime: "2016-05-02",
          building: "10楼",
          ID: "92304926562@qq.com",
          loginAccount: "张三",
        },
      ],
    };
  },
  mounted() {},
  beforeUnmount() {},
  methods: {},
};
</script>

<style lang="less" scoped>
@import "../../OperaManage/opera.less";

.search_bar {
  width: 100%;
  height: 46px;
  display: flex;
  align-items: center;
}
</style>
